<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css"/>
    <script src="/static/fsLayui/plugins/jquery/jquery.min.js"></script>
</head>
<body style="height: 300px;">
   <fieldset class="layui-elem-field layui=field-title" style="margin-top: 20px;">
       <legend>用户注册</legend>
   </fieldset>
   <form class="layui-form" action="/user/register" method="post" style="text-align: center">
       <div class="layui-form-item" style="margin-bottom: 5px;">
       <label class="layui-form-label">用&nbsp;&nbsp;户&nbsp;&nbsp;名</label>
       <div calss="layui-input-inline">
           <input type="text" name="userName" required="true" placeholder="请输入用户名" lay-verify="userName"
                  autocomplete="off" class="layui-input" style="width: 280px;"/>
       </div>
       </div>
       <div class="layui-form-item" style="margin-bottom: 5px;">
           <label class="layui-form-label">密&nbsp;&nbsp;码</label>
           <div calss="layui-input-inline" style="">
           <input type="password" name="password" required="true" placeholder="请输入密码" lay-verify="password"
                  autocomplete="off" class="layui-input" style="width: 280px;"/>
            </div>
       </div>
       <div class="layui-form-item" style="margin-top: 15px;text-align: center;">
           <button class="layui-btn layui=btn=normal layui-btn-radius" lay-submit="" lay-filter="checkForm"
                   style="width: 300px;">注册</button>
       </div>

   </form>
   <script src="/static/layui/layui.js"></script>
   <script src="/static/layui/layui.all.js"></script>
   <script>
       layui.form.verify({
          userName:[
              /^[\S]{5,15}$/,"用户名必须5到15位，且不能出现空格"
          ],
           password:[
               /^[\S]{6,15}$/,"密码必须6到15位，且不能出现空格"
           ]
       });
       layui.use('form',function(){
           var form=layui.form;
           //监听提交
           form.on('submit(checkForm)',function (data) {
               var url = "/user/register";
               var data = $("form").serializeArray();
               $.ajax({
                   type:"POST",
                   url: url,
                   data: data,
                   success: function (res) {
                       if(res.success){
                           layer.msg('注册成功！',{
                               icon: 1,
                               time: 1000
                           },function () {
                               //先得到当前iframe层的索引
                               var index = parent.layer.getFrameIndex(window.name);
                               parent.location.reload();
                               //再执行关闭
                               parent.layer.close(index);
                           });
                       }else{
                           layer.msg(res.errorInfo);
                       }
                   },
                   error: function (data) {
                       layer.msg("网络错误！");
                   }
               });
               return false;
           });
       });
   </script>
</body>
</html>